<!--
 * @Author: 布胖 3075981427@qq.com
 * @Date: 2025-09-10 16:35:06
 * @LastEditors: 布胖 3075981427@qq.com
 * @LastEditTime: 2025-09-11 20:33:26
 * @FilePath: \前端代码仓库\day03作业\登录.html
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米注册登录</title>
    <style>
        body {
            background-color: #0c0c0c;
        }

        .dl {
            /* align-self: center; */
            text-align: center;
            /* align-items: center; */
            /* border: 1px solid black; */
            border-radius: 4px;
            background-color:#242424;
            /* box-shadow: 5px 5px 5px #787474; */
            box-shadow: 0 20px 50px 0 hsla(0, 0%, 64%, .1);
            width: 360px;
            height: 487.713px;
            padding: 40px 45px 40px 45px;
        }

        p {
            font-size:35px;
            font-weight: 700;
            margin:0;
            float: left;
            color: aliceblue;
        }
        /* .zhenghaokong,.mimakong{
            background-color: #333;
            border: 1px solid transparent;
            border-radius: 4px;
        } */
        .zhenghaokong{
            background-color: #333;
            border: 1px solid transparent;
            border-radius: 4px;
            height: 65.2px;
            line-height: 20px;
            margin: 71px 0 0 0;
        }
        .mimakong{
            background-color: #333;
            border: 1px solid transparent;
            border-radius: 4px;
            height: 65.2px;
            line-height: 20px;
        }
        #zh{
            /* webkit-text-fill-color: #fff; */
            color: #fdfbfb4a !important;
            font-size: 17px;
            height: 60px;
            line-height: 20px;
            float: left;
            margin: 0;
            width: 300px;
            background-color: #333;
        }
        #mm{
            /* webkit-text-fill-color: #fff; */
            background-color: #333333;
            margin: 0;
            float: left;
            color: #fdfbfb2c !important;
            font-size: 17px;
            height: 60px;
            line-height: 20px;
            width: 300px;
        }
        .dlannv{
            width: 316px;
            height: 60px;
            background-color: #ff5c00;
            color: aliceblue;
            border-radius: 4px;
            font-size: 25px;
        }
        .zhuceannv{
            font-size: 25px;
            border-radius: 4px;
            color: aliceblue;
            background-color: #ff5c00;
            width: 316px;
            height: 60px;
        }
        /* .checkbox{
            color: aliceblue;
            } */
        /* a{
            color: aliceblue;
            } */
            span{
            color: aliceblue;

        }
        .mi-form-action .mi-link{
            font-size: 17px
        }
        a{
        background-color: transparent;
        color: #ff5c00;
        cursor: pointer;
        outline: none;
        text-decoration: none;
        transition: color .3s;
        }
        .mi-form-action--end{
            float: right;
            text-align: right;
        }
        .mi-form-action{
                margin-bottom: 10px;
        }
        .mi-form-actions--inline .mi-form-action{
                max-width: 48%;
        }
        .mi-form-action{
            font-size: 17px;
        }
    </style>
</head>

<body>
    <div class="dl">
        <p>注册</p>
        <form action="">
            <div class="zhenghaokong">
                <!-- <input name="account" aria-invalid="false" aria-errormessage="mi-form-error" class="mi-input__input" type="text" aria-label="邮箱/手机号码/小米ID" value=""> -->
                <input type="text" name="账号" value="手机号码" id="zh"><br>
            </div>
            <!-- <span style="margin: 10px;">账号：</span> -->
            <!-- <span style="margin: 10px;">密码：</span> -->
            <br>
            <div class="mimakong">
                <!-- <input type="password" name="password" aria-invalid="false" aria-errormessage="mi-form-error" class="mi-input__input" aria-label="密码" value=""> -->
                <input type="password" name="密码" aria-label="密码" id="mm"><br>
            </div>
            <br>
            <input class="checkbox" type="checkbox" name="" id=""><span>我已阅读小米账号使用协议和隐私政策</span><br>
            <!-- <a href="#"><input class="dlannv" type="button" value="登录" style="margin: 10px;"></a> -->
            <a href="#"><input class="zhuceannv" type="button" value="注册" style="margin: 10px;"></a>
            <div class="mi-form-actions mi-form-actions--inline">
                <div class="mi-form-action mi-form-action--start">
                <a class="mi-link" href="#">收不到验证码？</a>
                </div>
                <!-- <div class="mi-form-action mi-form-action--end">
                <a href="#">密码登录</a>
                </div> -->
            </div>
        </form>
    </div>
</body>

</html>